/**
 * File: Layout.tsx
 * Project: reactssr
 * Created Date: Wednesday 2018/01/03 15:50:43
 * Author: zhengjiang
 * -----
 * Last Modified: Thursday 2018/01/04 13:46:30
 * Modified By: zhengjiang
 * -----
 * Description: layout
 * 
 */

import * as React from 'react';
import { Row, Menu, Input, Col, Layout } from 'antd';
const { Header, Footer, Sider, Content } = Layout;
import * as NProgress from 'nprogress';
import Router from 'next/router';
import styled from 'styled-components';
import Link from 'next/link';
import { LocaleProvider } from 'antd';
import zhCN from 'antd/lib/locale-provider/zh_CN';
import { IStoreProps } from '../store/index';
Router.onRouteChangeStart = (url) => {
	NProgress.start();
};
Router.onRouteChangeComplete = () => NProgress.done();
Router.onRouteChangeError = () => NProgress.done();

//#region styled components
const LayoutPage = styled.div`
	width: 100%;
	& .outcontent {
		max-width: 1000px;
		min-height: calc(100vh - 133px);
		padding: 24px 0;
		margin: auto;
	}
	& .ant-layout-footer {
		background:#001529;
	}
`;

//#endregion

export interface ILayoutProps extends Partial<IStoreProps> {
	pathname: string;
}
class LayoutContent extends React.PureComponent<ILayoutProps, any> {
	constructor(props) {
		super(props);
	}

	render() {
		return (
			<LocaleProvider locale={zhCN}>
				<LayoutPage>
					<Layout>
						<Header>Header</Header>
						<Content>
							<div className="outcontent">{this.props.children}</div>
						</Content>
						<Footer>Footer</Footer>
					</Layout>
				</LayoutPage>
			</LocaleProvider>
		);
	}
}

export default LayoutContent;
